<template>
  <div>
    <div id="container" ref="con"></div>
  </div>
</template>

<script>
export default {
  name: "dubtionMap",
  data(){
    return {
      Amap:'',
    }
  },
  methods:{
    map(){
      let than = this;
      let con = this.$refs.con;
      let position = new AMap.LngLat(118.065585,24.615273);  // 标准写法
      this.mapA = new AMap.Map(con, {
        borderWeight: 2,
        strokeColor: 'red', // 线条颜色
        lineJoin: 'round', // 折线拐点连接处样式
        // layers: [new AMap.TileLayer.Satellite()],  //设置图层,可设置成包含一个或多个图层的数组
        mapStyle: 'amap://styles/normal',  //设置地图的显示样式
        viewMode: '2D',  //设置地图模式
        lang: 'zh_cn',  //设置地图语言类型
      });
      this.mapA.setCenter(position);
      // this.mapA.mapAsetZoomAndCenter(18,[118.062141,24.615508])
      this.mapA.panTo([118.065585,24.615273]);
      let marker1 = new AMap.Marker({
        position: new AMap.LngLat(118.065585,24.615273),   // 经纬度对象，如 new AMap.LngLat(116.39, 39.9); 也可以是经纬度构成的一维数组[116.39, 39.9]
        title: 'xm'
      });
      let marker2 = new AMap.Marker({
        position: new AMap.LngLat(118.062141,24.615508),   // 经纬度对象，如 new AMap.LngLat(116.39, 39.9); 也可以是经纬度构成的一维数组[116.39, 39.9]
        title: '友敏苑',
      });

      let path = [
        new AMap.LngLat("118.062141","24.615508"),
        new AMap.LngLat("118.065585","24.615273")
      ];
      let polyline = new AMap.Polyline({
        path: path,
        borderWeight: 2, // 线条宽度，默认为 1
        strokeColor: 'red', // 线条颜色
        // lineJoin: 'round' // 折线拐点连接处样式
      });

      this.mapA.add(marker1)
      this.mapA.add(marker2)
      // this.mapA.setFitView();
      this.mapA.setFitView([polyline,marker1]);



    },
  },
  mounted(){
    this.map();
  },
  destroyed() {
    this.Amap.destroy( );
  }
}
</script>

<style scoped>
#container {width:28rem;height: 35rem; }
/*移出高德地图*/
>>>.amap-logo{
  display: none;
  opacity: 0 !important;
}
>>>.amap-copyright {
  opacity:0;
}
</style>
